<template>
  <div class="main">
    <div class="topbar">
      <topbar1 :toli="list"></topbar1>
    </div>
    <div class="lbt" v-if="list==1">
      <lbt1></lbt1>
    </div>
    <div class="content" v-show="list==1">
      <homecontent></homecontent>
    </div>
    <div v-show="list==2">
      <product1></product1>
    </div>
    <div v-show="list==3">
      <aboutqj></aboutqj>
    </div>
    <div v-show="list==4">
      <newlist></newlist>
    </div>
    <div v-if="list==5">
      <huiyuan></huiyuan>
    </div>
    <div v-show="list==6">
      <contact1></contact1>
    </div>
    <div v-show="list>120">
      <singlenews></singlenews>
    </div>
    <div class="bottombar">
      <bottombar></bottombar>
    </div>

  </div>
</template>

<script>
  import homecontent from './homecontent.vue'
  import topbar1 from './topbar1.vue'
  import lbt1 from './lbt.vue'
  import bottombar from './bottombar.vue'
  import aboutqj from './about.vue'
  import product1 from './product.vue'
  import contact1 from './contact.vue'
  import newlist from './newlist.vue'
  import huiyuan from './reg.vue'
  import singlenews from './singlenews'
  export default {
    data() {
      return {
        list: 1,
        routes: ['/', '/homepage', '/product', '/about', '/health', '/usercenter', '/contact']
      }
    },
    mounted() {
      this.gettop()
      this.getreg()
      // console.log(this.$route)
      this.list = this.routes.indexOf(this.$route.path)
    },
    methods: {
      gettop() {
        Bus.$on('topbar', r => {
          this.list = r
          this.$router.push({ path: this.routes[r] })
          // console.log('r:', r, this.$route)
        })
      },
      getreg() {
        Bus.$on('go-reg', r => {
          this.list = r
        })
      }
    },
    components: {
      topbar1,
      lbt1,
      bottombar,
      aboutqj,
      product1,
      contact1,
      newlist,
      singlenews,
      homecontent,
      huiyuan
    },
  }
</script>
<style lang="scss" scoped>
  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    /* user-select: none; */
    font-family: PingFang-Sem !important;
  }

  .main{
    overflow: hidden;
    width: 100%;
    text-align: center;
  }
  .topbar {
    /* width: 1920px; */
    // height: 50px;
    margin-bottom: 10px;
    overflow-y: hidden;
    display: inline-block;
  }

  .content {
    /* margin-top: -40px; */
    /* width: 100%; */
    /* overflow-x: hidden; */
    position: relative;
    text-align: center;
  }

  .bottombar {
    /* overflow-x: hidden; */
  }

  .linshi {
    text-align: center;
    line-height: 600px;
    height: 600px;
  }
</style>
